<%@ page language="java" contentType="text/html; charset=utf-8"
	pageEncoding="utf-8" isELIgnored="false"%>
<%@ include file="/WEB-INF/views/shared/taglib.jsp"%>
<div style="margin-top: 10px;">
	<div class="hot-container">
		<div id="hot_dict_column"></div>
	</div>
	
	<!-- 
	<div class="col-sm-12">
         <div style="width:100px;height: 10px;margin-top:0.5rem; border: 2px solid #afafaf;border-radius:15px;"class="fileParent">
         	<div style="width:0px;height: 7px;background-color: #afafaf" class="fileProgress"></div>
         </div>			
    </div>
    
    <input type="hidden" id="fileId" > -->
</div>
<script type="text/javascript">
	function createSpreadsheetData(rowCount) {
		rowCount = typeof rowCount === 'number' ? rowCount : 10;
		var rows = [], i, j;
		for (i = 0; i < rowCount; i++) {
			rows.push({});
		}
		return rows;
	}
	
	
	$(function() {
		initTable();
		setTimeout(function(){
			clean();
		},700); 
	});
	
	var $hot=null;
	var typeCategory=['visitor','vip','maker','highMaker'];
	var empty=function(value, callback){
		setTimeout(function(){
			callback(!$.isNull(value));	
		},10);
	};
	function initTable(){
		
		var hot_dict_column = document.getElementById('hot_dict_column');

		$hot = new Handsontable(hot_dict_column, {
			rowHeaders : true,
			autoColumnSize:true,
			stretchH:'last',
			contextMenu: ['row_above', 'row_below', 'remove_row'],
			colHeaders : [ '客户编号', '地区', '客户等级', '姓名', "手机号码",'推荐人编号'],
			colWidths:[120,280,100,280,280],
			columns: [{data:'userIdentity',validator:empty},
			           {data:'region',validator:empty},
			           {data:'level',type: 'dropdown',source:typeCategory,validator:empty},
			           {data:'username'},
			           {data:'phone'},
			           {data:'refereeIdentity'}]
		});

		$hot.updateSettings({
			contextMenu : {
				items : {
					"row_above" : {name : '在上面添加行'},
					"row_below" : {name : '在下面添加行'},
					"remove_row" : {name : '删除当前行'}
				}
			}
		});
	}
	
	/* 
	function loadTable(){
		var excelInfoId=$("#excelInfoId").val();
		if($.isNull(excelInfoId)){return;}
		var url=$.getVirtualPath()+"/admin/setting/exportExcelColumn/exportExcelColumnJson?excelInfoId="+excelInfoId;
		var json=$.getJsonPost(url);
		if($.isNull(json)){
			return getEmptyData();
		}
		return json;
	} */
	
	function getEmptyData() {
		var hot_borders_data = createSpreadsheetData(10);
		return hot_borders_data;
	}
	
	/* function reload(){
		var data=loadTable();
		c.log(data);
		$hot.loadData(data);
		$hot.render();
	} */
	
	function saveForm(){
		deleteEmpty();
		
		$hot.validateCells(function(result){
			if(!result){
				alert("表格有错误信息，检查表格红色区域");
				return;
			}
			var updateCustomerColumns=getDataJson();
			var url=$.getVirtualPath()+"/admin/cust/customerColumn/update";
			$.ajax({
				url:url,
				type:'post',
				dataType:'json',
				contentType:"application/json",
				data:JSON.stringify(updateCustomerColumns),
				success:function(result){
					$.topNotify(result.message,result.resultType);	
				}
			});
			
		});
		
	}
	
	function getDataJson(){
		var rows=$hot.getSourceData();
		var columns=[];
		for(var i=0;i<rows.length;i++){
			var data=rows[i];
			columns.push({"userIdentity":data.userIdentity,
						  "region":data.region,
						  "level":data.level,
						  "username":data.username,
						  "phone":data.phone,
						  "refereeIdentity":data.refereeIdentity});
		}
		return columns;
	}
	
	//删除空行
	function deleteEmpty(){
		var rows=$hot.countRows();
		for(var i=rows-1;i>=0;i--){
			if($hot.isEmptyRow(i)){
				$hot.alter('remove_row', i);
			}
		}
	}
	
	
	function clean(){
		var data=getEmptyData();
		$hot.loadData(data);
		$hot.render();
	}
	
	function push(){
		/* 
		$("#fileId").startCosFileUpload({
			progressCallback:function(curr, sha1){
				$(".fileParent").show();
				$(".fileProgress").width(0);
				$(".fileProgress").width(sha1*96);
			}
		
		});
		var fileId = $("#fileId").val();
		alert("你好" + fileId);
		if($.isNull(fileId)){
			return;
		} */
		
		
		
		var url=$.getVirtualPath()+"/admin/cust/customerColumn/push";
		$.ajax({
			url:url,
			type:'post',
			dataType:'json',
			contentType:"application/json",
			data:{},
			success:function(data){
				$hot.loadData(data);
				$hot.render();	
			}
		});
	}
</script>

<%@ include
	file="/WEB-INF/views/shared/base/scripts/limitless/default/handsontable.jsp"%>
<%@ include file="/WEB-INF/views/shared/base/scripts/tools/upload-cos.jsp"%>